<template>
  <BaseBreadcrumb>
    <!-- 业主用户管理 -->
    <div class="ownersManage-container">
      <a-row :gutter="10"  class="page-height">
        <a-col :span="6">
          <a-card class="page-height-tree">
            <title-name title="公司组织架构" />
            <!-- 公司组织树搜索 -->
            <tree-organization
              ref="treeOrganization"
              :expand-by-auto="true"
              :show-search="true"
              :selected-keys.sync="selectedKeys"
              :select-options.sync="selectOptions"
              :org-query="{
                containTags: containTags,
                 baseOrgType: 0, // 是否基础组织 0否 1是
                 containVirtual: 0, //是否包含虚拟组织 0包含 1 不包含
                 systemOrgType: 1 //公司组织默认1

              }"
              :istakeOutHight="true"
            />
          </a-card>
        </a-col>
        <a-col :span="18" >
          <CommonUserList
            ref="commonUserList"
            :search-query="searchQuery"
          />
        </a-col>
      </a-row>
    </div>
  </BaseBreadcrumb>
</template>

<script>
import CommonUserList from '../CommonUserList.vue'
import TreeOrganization from '@/components/businessComponents/TreeOrganization' // 树
export default {
  name: 'OwnersManage',
  components: {
    TreeOrganization,
    CommonUserList,
  },
  data() {
    return {
      searchQuery: {},
      selectedKeys: [], // 选中节点
      selectOptions: {}, // 选中节点对象
    }
  },
  computed: {
    containTags(){
      return this.$store.getters['GET_ORGLABEL'].map(item => item.code)
    }
  },
  watch: {
    selectedKeys: {
      handler(list) {
        if (list && list.length > 0) {
          this.searchQuery = {
            blurPermissions: list[0],
          }
          this.$refs.commonUserList.handleSearch(this.searchQuery)
        }
      },
    },
  },
  mounted() {
    // 组织树获取数据
    this.$refs.treeOrganization.getList()
  },
}
</script>

<style>
</style>